<html>
  <head>
    <title>Terminal emulator</title>
    <script src="../../lib/js/jquery-1.2.6.js" type="text/javascript" language="javascript" charset="utf-8"></script>
    <script src="../../lib/js/jquery.bgiframe.js" type="text/javascript" language="javascript" charset="utf-8"></script>
    <script src="../../lib/js/jquery.ajaxQueue.js" type="text/javascript" language="javascript" charset="utf-8"></script>
    <script src="../../lib/js/jquery.dimensions.js" type="text/javascript" language="javascript" charset="utf-8"></script>
    <script src="../../lib/js/jqModal.js" type="text/javascript" language="javascript" charset="utf-8"></script>
    <script src="../../lib/js/jquery.autocomplete.js" type="text/javascript" language="javascript" charset="utf-8"></script>
    <script src="../../lib/js/jquery.template.js" type="text/javascript" language="javascript" charset="utf-8"></script>
    <script src="../../usr/lib/js/jquery-plugins/jquery.terminal_emulator.js" type="text/javascript" language="javascript" charset="utf-8"></script>

    <link rel="stylesheet" href="../../lib/js/jqModal.css" type="text/css" media="screen" title="no title" charset="utf-8" />
    <link rel="stylesheet" href="../../lib/js/jquery.autocomplete.css" type="text/css" media="screen" title="no title" charset="utf-8" />

    <script type="text/javascript">
    <!--
    $(document).ready(function(){
      $('#terminal_input').emulate_terminal( { output_id : 'terminal_output' } );
      $.fn.emulate_terminal.commands.whoa = function(o) { alert('whoa is an internal command :)') };});
    -->
    </script>
    
    <style type="text/css">
    body, input {
      font-family:"lucida grande",tahoma,verdana,arial,sans-serif;
      font-size:11px;
      margin:0px;
      padding:0px;
      text-align:left;
    }

    .terminal_input {
      width:100%;
      height:5%;
      margin-top:5px;
      border:inset 1px #ccc;
    }
    .terminal_output {
      background:#eeeeee;
      overflow-y:auto;
      padding:5px;
      height:90%;
      border:solid 1px #ccc;
    }
    .terminal_emulator
    {
      width:80%;
      height:90%;
      margin:auto;
      clear:both;
      padding:5px;
      background:#aaa;
      border:outset 1px gray
    }
    </style>
  </head>

  <body>
    <div id="terminal_emulator" class="terminal_emulator">
    <div id="terminal_output" class="terminal_output"></div>
        <input type="text" id="terminal_input" class="terminal_input" />
    </div>
  </body>
    
</html>
